<!DOCTYPE html>
<html>
<head>
	<title>set和map</title>
</head>
<body>
<div>
	<p>1</p>
	<p>1</p>
	<p>1</p>
	<p>1</p>
	<p>1</p>
</div>
<script type="text/javascript">
	
/* set 
	
	1. set是一种数据解构，本身也是构造函数，类似于数组，但是set的值唯一，既不能出现重复值

	2. 接收的参数可以为数组，也可以类似于数组的对象，即伪数组

	3. 使用的是精确的判等===， NaN除外，set认为NaN相同

	4. api
		- add(value)： 		添加某个值，返回Set结构本身。
		
		- delete(value): 	删除某个值，返回一个布尔值，表示删除是否成功。

		- has(value)：      返回一个布尔值，表示该值是否为Set的成员。
		
		- clear()： 		清除所有成员，没有返回值。

	5. set的遍历 
		- keys()： 		返回键名的遍历器

		- values()： 	返回键值的遍历器
		
		- entries()： 	返回键值对的遍历器
		
		- forEach()： 	使用回调函数遍历每个成员

	6. Array.from可以将set转换为数组

	7. 数组的map和filter 方法也可以用于Set

*/
// 1. 为数组作为参数
let p = document.getElementsByTagName('p');
let set = new Set(p);
console.log(set);
set.clear();



// 2. 验证NaN和{}
let a = NaN;
set.add(a);
console.log(set);		// size = 1
let b = NaN;
set.add(b);
console.log(set);		// size = 1
let aa = {};
set.add(aa);
console.log(set);		// size = 2
let bb = {};
set.add(bb);
console.log(set);		// size = 3



// 3. Array.from转换set,返回修改后的数组，源数据不变
{
	let set = new Set(p);
	set = Array.from(set);
	console.log(set);
} 



// 4. map和filter
{
	let set = new Set([1, 2, 3]);
	let a = new Set([1, 2, 3]);
	let b = new Set([4, 3, 2]);
	let intersect = new Set([...set].map(x => x * 2));
	console.log(intersect) 			// 返回Set结构：{2, 4, 6}

	// 差集
	let difference = new Set([...a].filter(x => !b.has(x)));
	console.log(difference)   		// Set {1}
}



/* 用途

	1. 数组的去重
	
*/


// 1. 数组的去重
let arr = [1, 4, 5, 7, 3, 4, 3, 9];
arr = [...new Set(arr)];		// 方法一
arr = Array.from(new Set(arr)); // 方法二
console.log(arr); 


</script>
</body>
</html>